<script src="__PUBLIC__/static/bootstrap/js/md5.js"></script>
<!--<script src="__PUBLIC__/static/user/js/jquery-2.0.3.min.js"></script>-->
<script src="__PUBLIC__/static/layer/layer.js" type="text/javascript" charset="utf-8"></script>

<style type="text/css">
	#loginModal {
		position: absolute;
		top: 2px;
		right: 4px;
		width: auto;
		display: none;
		z-index: 1000;
	}
</style>
<div id="loginModal" class="col-md-10">

	<div class="modal-dialog col-md-10">
		<div class="modal-content col-md-10">
			<div class="modal-header">
				<button type="button" class="close" onclick="document.getElementById('loginModal').style.display='none'">x</button>
				<h1 class="text-center text-primary" style="font-size: 18px;font-family: '微软雅黑';">登录</h1>
			</div>
			<div class="modal-body">
				<form id="form1" action="" class="form col-md-12 center-block">
					<div class="form-group">
						<input type="text" id="account" class="form-control input-lg" placeholder="手机号/用户名" maxlength="15" required="" style="font-size: 14px;font-family: '微软雅黑';">
					</div>
					<div class="form-group">
						<input type="password" id="pwd" class="form-control input-lg" maxlength="15" placeholder="登录密码" style="font-size: 14px;font-family: '微软雅黑';">
					</div>
					<div class="form-group">
						<button class="btn btn-primary btn-lg btn-block" type="submit" style="font-size: 14px;font-family: '微软雅黑';">登录</button>
						<span><a href="#" style="font-size: 14px;font-family: '微软雅黑';">找回密码</a></span>
						<span><a href="{:url('index/User/registerPage')}" class="pull-right" style="font-size: 14px;font-family: '微软雅黑';">注册</a></span>
					</div>
				</form>
			</div>
			<div>

			</div>
		</div>
	</div>
</div>
<div id="mine" style="display: none;">
	<form id="form" class="form-horizontal" role="form">
		<div class="form-group">

		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">头像</label>
			<div class="col-sm-1">
				<img id="head_img" width="60px" height="60px" />
			</div>
			<div class="col-sm-4">
				<input id="display" name="display" type="file" onchange="preImg(this.id,'head_img')" class="btn-file" />
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">昵称</label>
			<div class="col-sm-5">
				<input type="text" required="" maxlength="20" class="form-control" id="nickname" name="nickname">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">个人签名</label>
			<div class="col-sm-5">
				<input type="text" required="" maxlength="30" class="form-control" id="motto" name="motto">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">手机号</label>
			<div class="col-sm-5">
				<input type="text" class="form-control" id="phone" name="phone" maxlength="11" required="">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">用户名</label>
			<div class="col-sm-5">
				<input type="text" class="form-control" id="user" name="user" maxlength="15" required="">
			</div>
		</div>
		<div class="form-group">
			<div class="col-sm-offset-6 col-sm-3">
				<input type="submit" value="保存设置" class="btn btn-danger" style="font-size: 14px;font-family: '微软雅黑';">
			</div>
		</div>

	</form>
</div>
<div id="security" style="display: none;">
	<form id="form2" class="form-horizontal" role="form">
		<div class="form-group">

		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">原密码</label>
			<div class="col-sm-5">
				<input type="password" value="" required="" maxlength="15" class="form-control" id="pwd0" name="pwd0">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">新密码</label>
			<div class="col-sm-5">
				<input type="password" value="" placeholder="6-15位字符" required="" maxlength="15" class="form-control" id="pwd1" name="pwd1">
			</div>
		</div>
		<div class="form-group">
			<label class="col-sm-4 control-label" style="font-size: 14px;font-family: '微软雅黑';">确认密码</label>
			<div class="col-sm-5">
				<input type="password" placeholder="请再次输入密码" required="" maxlength="15" class="form-control" value="" id="pwd2" name="pwd2">
			</div>
		</div>
		<div class="form-group">
			<div class="col-sm-offset-6 col-sm-3">
				<input type="submit" value="保存密码" class="btn btn-danger" style="font-size: 14px;font-family: '微软雅黑';">
			</div>
		</div>
	</form>
</div>
<script type="text/javascript">
	var a = document.getElementById('l_login');
	//还未登录
	if(a != null) {
		a.onmouseover = function() {
			document.getElementById('loginModal').style.display = 'block';
		};
	}
	$(document).bind('mouseover', function(e) {　　
		var e = e || window.event; //浏览器兼容性 
		　　
		var elem = e.target || e.srcElement;　　
		while(elem) { //循环判断至跟节点，防止点击的是div子元素 
			　　　　
			if(elem.id && elem.id == 'loginModal') {　　　　
				return;　　
			}
			if(elem.id&&elem.id=='l_login'){
				return;
			}　　
			elem = elem.parentNode;　　
		}

		　　
		$('#loginModal').css('display', 'none'); //点击的不是div或其子元素 
	});
	$("#changepwd").click(function() {
		layer.open({
			type: 1,
			title: '修改密码',
			maxmin: false,
			anim: 2,
			scrollbar: false,
			//offset: '320px',
			shadeClose: true, //点击遮罩关闭层
			area: ['700px', '300px'],
			content: $("#security"),
			success: function(layero, index) {
				console.log(layero, index);
			}
		});
	});
	$("#changeinfo").click(function() {
		$.ajax({
			type: "post",
			url: "../../index/User/getInfo",
			cache: false,
			async: true,
			success: function(r) {
				$('#head_img').attr("src", "__PUBLIC__/static/user/headimg/" + r.head_img);
				$('#nickname').val(r.nickname);
				$('#motto').val(r.motto);
				$('#phone').val(r.phone);
				$('#user').val(r.user);
			},
			error: function(r) {
				alert("加载数据失败！");
			}
		});
		layer.open({
			type: 1,
			title: '我的信息',
			maxmin: false,
			anim: 2,
			scrollbar: false,
			//offset: '320px',
			shadeClose: true, //点击遮罩关闭层
			area: ['700px', '400px'],
			content: $("#mine"),
			success: function(layero, index) {
				console.log(layero, index);
			}
		});
	});

	function getFileUrl(sourceId) {
		var url;
		if(navigator.userAgent.indexOf("MSIE") >= 1) { // IE  
			url = document.getElementById(sourceId).value;
		} else if(navigator.userAgent.indexOf("Firefox") > 0) { // Firefox  
			url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
		} else if(navigator.userAgent.indexOf("Chrome") > 0) { // Chrome  
			url = window.URL.createObjectURL(document.getElementById(sourceId).files.item(0));
		}
		return url;
	}

	function checkimg() {
		var path = document.getElementById('display').value;
		var point = path.lastIndexOf('.');
		var type = path.substr(point);
		if(type == ".bmp" || type == ".jpg" || type == ".gif" || type == ".JPG" || type == ".GIF" || type == ".PNG" || type == ".png") {
			if(document.getElementById('display').files[0].size < 1024 * 1024 * 2) {
				return true;
			} else {
				alert('图片应在大小在2M以内，请重新上传！');
				document.getElementById('display').value = "";
				return false;
			}

		} else {
			alert("图片格式错误！");
			document.getElementById('display').value = "";
			return false;
		}

	}

	function preImg(sourceId, targetId) {
		if(checkimg()) {
			var url = getFileUrl(sourceId);
			var imgPre = document.getElementById(targetId);
			imgPre.src = url;
		}
	}
	$('#form').submit(
		function(e) {
			e.preventDefault();
			var phone = document.getElementById('phone').value;
			var user = document.getElementById('user').value;
			message = "";
			if(!(/^1[3|4|5|6|7|8][0-9]\d{4,8}$/.test(phone))) {
				message += "手机号格式不正确！\n";
			}
			if(user.length < 6) {
				message += "用户名长度不能小于6个字符！\n";
			} else if(/^1[3|4|5|6|7|8][0-9]\d{4,8}$/.test(user)) {
				message += "用户名不能为手机号！\n";
			}
			if(message != "") {
				alert(message);
			} else {
				var fd = new FormData($('#form')[0]);
				$.ajax({
					type: "post",
					url: "../../index/User/saveInfo",
					async: true,
					data: fd,
					processData: false,
					contentType: false,
					success: function(r) {
						var message = "";
						if(r.nickname == 0) {
							message += "昵称修改失败，该昵称已经被其他用户使用！\n";
						}
						if(r.headimg == 0) {
							message += "头像上传失败！\n";
						}
						if(r.phone==0){
							message += "该手机号已被注册！\n";
						}
						if(r.userlogin==0){
							message+="该用户名已被注册！\n";
						}
						if(message == "") {
							message = "修改成功！";
							location.reload();
						}
						alert(message);

					},
					error: function(r) {
						alert("服务器出现未知错误！");
						location.reload();
					}
				});
			}

		}
	);
	$('#form2').submit(
		function(e) {
			e.preventDefault();
			var pwd = document.getElementById('pwd1').value;
			var pwd2 = document.getElementById('pwd2').value;
			var m = ""
			if(pwd.length < 6 || pwd2.length < 6) {
				m += "密码至少为6位\n";
			}
			if(pwd != pwd2) {
				m += "两次密码输入不一致！\n";
			}
			if(m != "") {
				alert(m);
			} else {
				$.ajax({
					type: "post",
					url: "../../index/User/changePwd",
					cache: false,
					async: true,
					data: {
						'pwd0': hex_md5($("#pwd0").val()),
						'pwd': hex_md5($("#pwd1").val()),
						'pwd2': hex_md5($("#pwd2").val())
					},
					success: function(r) {
						var message = "";
						if(r == '0') {
							message += "原密码错误！\n";
							alert(message);
						}
						if(message == "") {
							message = "修改成功！";
							alert(message);
							location.reload();
						}
					},
					error: function(r) {
						alert("修改失败！");
						location.reload();
					}
				});
			}

		}
	);
	$('#form1').submit(
		function(e) {
			e.preventDefault();
			var message = "";
			var phone = document.getElementById('account');
			var pwd = document.getElementById('pwd');
			if(phone.value == null || phone.value == "") {
				message += "账号不能为空！\n";
			}
//			else if(!(/^1[3|4|5|6|7|8][0-9]\d{4,8}$/.test(phone.value))) {
//				message += "账号格式不正确！\n";
//			}
			if(pwd.value == null || pwd.value == "") {
				message += "密码不能为空！\n"
			}
			if(message != "") {
				alert(message);
			} else {
				$.ajax({
					type: "post",
					url: "../../index/User/login",
					cache: false,
					async: true,
					data: {
						'account': $("#account").val(),
						'pwd': hex_md5($("#pwd").val())
					},
					success: function(data) {
						if(data == "1") {
							//window.location.href = "mai";
							location.reload();
						} else if(data == "2") {
							alert("该账号不存在！");
						} else if(data == "3") {
							alert("密码错误！");
							$("#pwd").val() = "";
						} else if(data == "4") {
							alert("该账户已被冻结或禁用请联系管理员！");
						} else {
							alert("出现错误！");
						}
					},
					error: function() {
						alert("服务器出错了");
					}
				});
			}
		}
	)
</script>